@import "commonvars";

@mixin topbarTheme($class) {
  .topbar {
    line-height: $header-height;
    background: $topbar-background;

    .logo {
      color: $link-color;
      background: $topbar-background;
    }

    ul.actions {
      color: $hover-dropdown-color;

      li.dropdown {
        color: $hover-dropdown-color;
        &.selected,
        &:hover {
          background-color: $selected-dropdown-background;
          color: $hover-dropdown-color;
        }

        ul.subactions .btn {
          color: $submenu-text-color;
          background: $sidebar-background;
          border-bottom-color: $submenu-border-color;

          &:hover {
            background-color: $selected-dropdown-background;
            color: $hover-submenu-dropdown-color;
          }
        }
      }
    }

    .language-select {
      background: $sidebar-background;
      color: $submenu-text-color;
      border: 2px solid $submenu-border-color;
      padding: 4px 8px;
      border-radius: 4px;
      font-size: 0.9em;

      &.dark {
        background: $topbar-background;
        color: $hover-dropdown-color;
        border: 2px solid $selected-dropdown-background;
      }
      &.light {
        background: #fff;
        color: #222;
        border: 2px solid #ccc;
      }
    }
  }
}
